﻿@model List<ComicBook.DataModels.Comic>

<div class="jumbotron" style="background-color:darkslategrey; color:antiquewhite">
    <h1>Comic Book List</h1>
    <button class="btn btn-sm btn-primary pull-right" onclick="location.href='/Add/AddComic/'">Add New Comic</button><br />
</div>
<br /><br />
<div id="wrapper">
    @foreach (var comic in Model)
{
    <div class="row table-bordered" onclick="location.href='/Comic/ComicDetail/@comic.Id'">
        <div class="col-md-4">
            <h1 class="jumbotron" id="titleHover"><img class="img-responsive" src="@comic.Image" /></h1>
        </div>
        <div class="col-md-6 text-center">
            <br /><br />
            <div class="row">
                <div>
                    <h2><br /><br /><br />@comic.Title</h2>
                </div>
                @*<div >
                        <table class="table table-hover">
                            <tr><th colspan="2">Character List</th></tr>
                            @foreach (var c in @comic.Characters)
                            {
                                <tr>
                                    <td></td>
                                    <td class="text-left" onclick="location.href='/Character/Detail/@c.Id'">@c.Name</td>
                                </tr>
                            }
                        </table>
                    </div>*@
            </div>

        </div>
        @*<div class="col-md-2">
                <button class="btn-danger pull-right" onclick="location.href='/Home/Delete/@post.ID'">Delete Comic</button>
                <button class="btn-warning pull-right" onclick="location.href='/Home/EditPost/@post.ID'">Edit Comic</button>
            </div>*@
    </div>

}

</div>